<%--
  Created by IntelliJ IDEA.
  User: aiwzy
  Date: 2022/4/17
  Time: 9:26
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<html>
<head>
    <title>顶头导航</title>
    <link rel="stylesheet" href="css/head.css" type="text/css">
</head>
<body>
<div class="head">
    <ul class="u1">
        <li><a href="index.jsp" >美食天下 首页</a></li>
        <li><a href="dish.jsp">菜谱</a></li>
        <li><a href="cook.jsp">食材</a></li>
        <li><a href="#">专题</a></li>
        <li><a href="#">笔记</a></li>
        <li><a href="#">社区</a></li>
        <li><a href="#">活动</a></li>
        <li><a href="#">搜索</a></li>
    </ul>
    <a class="nr" href="#" style="    float: right;
    position: relative;
    top: -47px;
    display: block;
    font-size: 10px;
    color: #f1f1f1;
    width: 68px;
    text-align: center;
    line-height: 13px;
    background-color: #FE5761;
    height: 100%;
    text-decoration: none;
    margin-left: 0;"><img src="image/nr3.png" style="width: 18px;height: 18px;margin-top: 5px;"/><br/>客户端</a>
    <ul class="u2" style=" position: fixed;
    right: 68px;
    top: -16px;">
        <li class="pic">

        <img src="
        <c:if test="${!sessionScope.user.avatar.equals('')}">
        ${sessionScope.user.avatar}
        </c:if>
        <c:if test="${!sessionScope.user.avatar.equals('')}">
        https://tse2-mm.cn.bing.net/th/id/OIP-C.Z8cO0OriANaUVakbQ6n0BwAAAA?w=153&h=165&c=7&r=0&o=5&dpr=1.65&pid=1.7
        </c:if>
" onclick="jump()" style="width: 35px;height: 35px; border-radius: 45%;cursor: pointer" alt="不好意思，请登录">
            <script src="js/jquery-3.2.1.min.js"></script>
            <script type="text/javascript">
                function jump(){
                    var src = $("img")[0].src;
                    $.ajax({
                        url:http_request+"/member.jsp",
                        data:{
                            img:src
                        },
                        dataType:"text",
                        success:function (){
                            alert("欢迎来到个人中心！")
                            window.location.href=http_request+"/member.jsp"
                        },
                        error:function (){
                            alert("个人中心跳转失败！")
                        }
                    })
               }
            </script>

        </li>
        <li class="l2">

            <c:if test="${empty sessionScope.user.username}">
                <div class="d1" >
                    <a href="login.jsp" >登录/注册</a>
                </div>
            </c:if>
            <c:if test="${not empty sessionScope.user.username}">
                <div class="d1" >
                    <a href="member.jsp"  style="font-size: 15px; text-align: center; vertical-align: middle">${sessionScope.user.username}</a>
                </div>
            </c:if>

<%--
<%--


<%--    <script type="text/javascript" >--%>
<%--        // function cl(){--%>
<%--        //     console.log(this.state)--%>
<%--        // }--%>
<%--            // var u1 =document.getElementById("logAndReg");//获取登录注册组件id--%>
<%--            // var name = document.getElementById("name").innerText;--%>
<%--            // console.log(name)--%>
<%--            // var elementById = document.getElementById("name");--%>
<%--            // if ( name != "")//判断当前span数据是否为空--%>
<%--            // {--%>
<%--            //     u1.style.visibility="hidden";//数据不为空则隐藏登录注册组件--%>
<%--            // }else{--%>
<%--            //     elementById.style.visibility="hidden";//数据为空则隐藏用户信息组件--%>
<%--            // }--%>


<%--    </script>--%>

        </li>
        <li class="l1"><div><a href="#"><img src="image/nr1.png" style="width: 18px;height: 18px;margin-top: 5px;padding-left: 2px" alt="不好意思，请登录"/><br/>发布</a></div></li>
        <li class="l1" ><div><a href="#"><img src="image/nr2.png" style="width: 18px;height: 18px;margin-top: 5px;padding-left: 2px"/><br/>签到有礼</a></div></li>
    </ul>
</div>
</body>
</html>
